<!DOCTYPE html>
<html>
<head>

	<title></title>

    <include file='public/head'>

        <style>

			.layui-legend-size{font-size:14px !important;}

			.layui-nopadding{padding:0 !important;}

			.layui-overflow{overflow:auto;}

			.layui-nomargin{margin: 0 !important;}

			.layui-bottom{border-bottom:1px solid rgb(226, 226, 226);}

			.layui-input{height:30px !important; }

			.layui-form-search-item .layui-inline{margin-bottom: 5px;} 

			.layui-form-search-item label{margin-left: 15px;}

			.layui-table-page {padding: 7px 0px 0px;}

			.layui-field-padding{border-width: 1px;padding:0 0 5px 10px;}

        </style>

</head>

<body>

	<!-- layui-tab开始 -->

	<div class="layui-tab" lay-filter="demo-tab" >



        <!-- 内容开始-->

		 <!-- 搜索栏开始 -->

		<fieldset class="layui-elem-field layui-field-title layui-field-padding">

			<legend class="layui-legend-size">搜索</legend>

			<form class="layui-form table-bar" action="{:cmf_plugin_url('SiteConfig://home_page_config/mbconfigadd')}" lay-filter="form-bar">
				<div class="layui-form-search-item">

				    <label>选择相关店铺</label>

					<div class="layui-inline" >

						<div class="layui-input-inline " style="width: 100px;">

							<select name="store_id" id="">

    						    <option value="qb">全部</option>

    						    <volist name="storelist" id="vo">

    						        <option value="{$vo.store_id}">{$vo.store_name}</option>

    						    </volist>

    						</select>  

						</div>

					</div>

					<label>选择模板</label>

					<div class="layui-inline" >

						<div class="layui-input-inline " style="width: 100px;">

							<select name="mb_id" id="">

    						    <option value="">请选择模板</option>

    						    <volist name="mblist" id="vo">

    						        <option value="{$vo.id}">{$vo.name}</option>

    						    </volist>

    						</select>  

						</div>

					</div>

					

					<div class="layui-inline">

						<div class="layui-input-inline " style="width: 100px;" >

							<select name="field" lay-verify=""  >

							    <option value="all">筛选项</option>

								<option value="title">标题</option>

								<option value="introductory">介绍</option>

							</select>

						</div>

						<div class="layui-input-inline" style="width: 100px;">

							<input type="text" name="keywords" autocomplete="off" placeholder="请输入关键字..." class="layui-input">

						</div>

					</div>

					

					

					<input type="hidden" name="type"  value="{$search['type']|default='0'}" />



					<div class="layui-inline">

						<button type="submit" name="search" class="layui-btn layui-btn-sm layui-btn-primary " style="font-weight:800;" lay-submit="" lay-filter="demo2"><i class="layui-icon ">&#xe615;</i>拉取数据</button>

					</div>

				</div>

			</form>

		</fieldset>

		<!-- 搜索栏结束 -->



		<!-- 内容开始 -->

		<form  class="layui-form" action="">



			<!-- 数据表格开始 -->

			<table class="layui-hide" id="article_tab" lay-filter="article_tab"></table>

			<!-- 数据表格结束 -->



			<!-- 表头部工具开始 -->

			<script type="text/html" id="toolbarDemo">

				<div class="layui-btn-container">

					<button type="button" class="layui-btn layui-btn-xs layui-btn-danger" lay-event="batch_delete">批量删除</button>

					<button type="button" class="layui-btn layui-btn-xs layui-btn-normal" lay-event="batch_add_mb">模板管理</button>

				</div>

			</script>

			<!-- 表头部工具结束 -->



			<script type="text/html" id="image">

				{{# if( d.img != '' ){ }}

				<img style="width:60px;height:25px;" src="{{d.img}}" alt="">

				{{# } }}

			</script>



			<!--这个是选择框tpl-->

			<script type="text/html" id="show_tpl">

				<input type="checkbox" name="status" value="{d.status}" lay-skin="switch" lay-text="隐藏|显示" lay-filter="show_switch" {{# if(d.status==1){ }} checked {{# } }} >

			</script>



			<!-- toolbar - 工具条模板开始 -->

			<script type="text/html" id="action_bar">

				<div class="layui-btn-group">

					<button type="button" class="layui-btn layui-btn-primary layui-btn-xs " title="移除"  lay-event="delete">

						<i class="layui-icon">&#xe640;</i>

					</button>

				</div>

			</script>

			<!-- toolbar - 工具条模板结束 -->

		</form>

		<!-- 内容结束 -->

		<!-- 内容结束-->

	</div>

	<!-- layui-tab结束-->



	<include file='public/scripts'>



	<!-- script开始-->	

	<script>



		var form = layui.form

			,layer = layui.layer    //弹出层必需

			,layedit = layui.layedit  //富文本必需

			,laydate = layui.laydate  //日期选择必需

			,table = layui.table  //表格必需

			,element = layui.element;  //选项卡	

			

		form.on( 'submit(demo2)' , function( data ){

		    var field = data.field;



		    if( field.mb_id == '' ){

		        layer.msg( '请选择模板' );

		        return false;

		    }

		    

		    var post = [];

		    for ( let key in field ){

		        post.push( ( key +"="+ field [ key ] ) ); 

		    }

		    post = post.join("&");



		    //渲染表格

            table.render({

                elem: '#article_tab'

                ,cellMinWidth: 40 //全局定义常规单元格的最小宽度，layui 2.2.1 新增

				,limit:20

                ,url:"{:cmf_plugin_url('SiteConfig://home_page_config/getData')}?"+post//数据接口

                ,method:'post'

				,toolbar: false //开启表格头部工具栏区域

				,cols: [[

				    {type:'checkbox'}

					,{field:'relevance_id',  title: '关联id' , width:50 }

					,{field:'title', title: '标题'}

					,{field:'img',title:'图片' , templet:'#image'}

					,{field:'introductory', title:'简介'}

					,{field:"addr" , title:"地址"}

					,{field:"addr_type" , title:"超链接|路由地址"}

					,{field:"status" , title:"状态",templet: '#show_tpl', unresize: true }

					,{field:"delay" , title:"时间"}

					,{field:'cate_url', title:'操作', width: 70,toolbar:'#action_bar'}

                ]]//设置表头

                ,page:true//开启分页

                ,response: {

                  statusCode: 200 //重新规定成功的状态码为 200，table 组件默认为 0

                }

				,parseData: function(res){ //res 即为原始返回的数据

					return {

    					"code": res.code, //解析接口状态

    					"msg": res.message, //解析提示文本

    					"count": res.data.total, //解析数据长度

    					"data": res.data.data //解析数据列表

					};

				}

         

 

            });

            

            //表格工具栏

    		table.on('tool(article_tab)', function(obj){

    			var data = obj.data;

    			if(obj.event === 'delete'){

    			    obj.del();

    			}

    		});

    

		    return false;

		} );

		

		var callbackdata = function(){

		    var checkStatus = table.checkStatus('article_tab');

		    if( checkStatus.data.length == 0 ){

		        

		        return false;

		    }

		    return checkStatus.data;

		}









	</script>

	<!-- script结束-->



</body>

</html>